.dux-aside {
  position: fixed;
  top: $header-height;
  left: 0;
  bottom: 0;
  width: $aside-width;
  height: 100%;
  background: #fff;
  display: flex;
  z-index: 200;
  ul, li,p {
    list-style: none;
    margin: 0;
    padding: 0;
  }
  .aside-main {
    width: 70px;
    height: 100%;
    overflow-x: hidden;
    background: #333744;
    text-align: center;
    a {
      display: block;
      color: #999;
      padding: 10px 0;
      font-size: 1.4rem;
    }
    i {
      font-size:1.8rem;
      width: 28px;
      height: 28px;
    }
    li {
      &.active {
        a {
          color: #fff;
          background: #42485b;
        }
      }
    }

  }
  .aside-sub {
    overflow-x: hidden;
    background: #fff;
    border-right: 1px solid #ddd;
    flex: 1;
    .sub-item {
      display: none;
      &.active {
        display: block;
      }
      li {
        &.active {
          a {
            color: #2096f3;
          }
        }

      }
      a {
        display: block;
        height: 35px;
        line-height: 35px;
        padding: 0 20px;
        color: #000;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
      }
      .name {
        font-size: 1.6rem;
        padding: 15px 20px;
        padding-bottom: 10px;
        color: #999;

      }

    }

  }

}

/*
.dux-aside {
  position: fixed;
  top:$header-height;
  left: 0;
  bottom: 0;
  width: $aside-width;
  background: #e6e7e8;
  border-right:1px solid #ccc;
  z-index: 100;
  ul {
    list-style: none;
    margin: 0;
    padding: 0;
  }
  li {
    text-align: center;


    a {
      display: block;
      color: #444;
      padding: 10px 0;
      font-size: 1.2rem;
      i {
        font-size:1.8rem;
      }
      &:hover {
        background: #ddd;
      }

    }

    &.active > a, a:hover {
      background: #ddd;
    }
    p {
      margin: 0;
    }
  }
}
*/
